<div class="modal fade branch-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-keyboard="false" aria-hidden="true"
  id="message">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">事物提醒 (共 {{counts }} 条提醒)</h4>
      </div>
      <ul class="nav nav-tabs">
        <li class="nav-item" [ngClass]="{'active':tabSwitch==0}" (click)="tab(0)">
          <a>
            <span>订单提醒</span>
            <span class="count" *ngIf="countsOrder > 0">{{countsOrder}}</span>
          </a>
          
        </li>
        <li class="nav-item" [ngClass]="{'active':tabSwitch==1}" (click)="tab(1)">
          <a>
            <span>入库提醒</span>
            <span class="count" *ngIf="countsStorage > 0">{{countsStorage}}</span>
          </a>
        </li>
        <li class="nav-item" [ngClass]="{'active':tabSwitch==2}" (click)="tab(2)">
          <a>
            <span>合同提醒</span>
            <span class="count" *ngIf="countsContract > 0">{{countsContract}}</span>
          </a>
        </li>
      </ul>
      <div class="modal-body">
        <app-messageorder  [ngClass]="{'hide':tabSwitch != 0}"></app-messageorder>
        <app-messagestorage [ngClass]="{'hide':tabSwitch != 1}"></app-messagestorage>
        <app-messagecontract  [ngClass]="{'hide':tabSwitch != 2}"></app-messagecontract>
      </div>  
    </div>
  </div>
</div>